<template>

  <div> 

    <el-dialog title="交易限制变更日志" :visible.sync="dialogVisible" width="60%" :close-on-click-modal="false">
    
      <!--主列表数据-->
      <d2-crud
        ref="d2Crud"
        :options="mainTable.options"
        :index-row="mainTable.indexRow"
        :columns="mainTable.columns"
        :data="mainTable.list"
        :selection-row="mainTable.allowSelect"
        :loading="mainTable.loading"
        :rowHandle="mainTable.rowHandle"
        @current-change="onMainCurrentChange"
        @custom-emit-handle-channel-limit-log="handleChannelLimitLog"
      ></d2-crud>

      <div slot="footer" class="dialog-footer">
        <el-button @click="close" size="small">关 闭</el-button>
      </div>

    </el-dialog>

    <dialog-channel-limit-log ref="dialog-channel-limit-log"></dialog-channel-limit-log>
  </div>

</template>

<script>

import ApiMain from '@/api/common';
import DialogChannelLimitLog from './dialog-channel-limit-log';
export default {
  components: {
    'dialog-channel-limit-log': DialogChannelLimitLog,
  },
  mixins: [
  ],
  props: [
  ],
  data () {
    return {

      dialogVisible: false,
      mainTable: {
        loading: false,
        options: {
          border             : true,
          stripe             : true,
          highlightCurrentRow: true,
          emptyText          : '暂无数据',
          size               : 'mini',
        },
        indexRow: null,
        allowSelect: false,
        columns: [
          {title: '终端号', key: 'terNo', align: 'center', width: '150', showOverflowTooltip: true},
          {title: '商户号', key: 'mchNo', align: 'center', width: '150', showOverflowTooltip: true},
          {title: '网关通道集合', key: 'channelCollectionName', width: '150', align: 'center', showOverflowTooltip: true},
          {title: '操作人', key: 'createBy', align: 'center', width: '150', showOverflowTooltip: true},
          {title: '更新时间', key: 'createTime', align: 'center', width: '150', showOverflowTooltip: true},
        ],
        rowHandle: {
          width: '120',
          align: 'center',
          fixed: 'right',
          custom: [
            {
              text: '详情',
              type: 'primary',
              size: 'mini',
              emit: 'custom-emit-handle-channel-limit-log'
            }
          ]
        },
        list: [],
        pagination: {
          currentPage: 1,
          pageSize   : 50,
          total      : 0,
          pageSizes  : [50, 100, 200]
        },
      },

    }
  },

  methods: {

  	show (id = null) {

      this.id = id;

      this.fetchData();

      this.dialogVisible = true;
    },

    close () {
      this.dialogVisible = false;
      this.$emit('dialog-close');
    },

    fetchData () {
    	this.mainTable.loading = true;
    	ApiMain.getChannelCollectionTerConLog({ terId: this.id })
      .then(re => {
      	this.mainTable.loading = false;
        this.mainTable.list = re;
      })
    },

    onMainCurrentChange (now, old) {
      this.mainTable.current = now;
    },

    handleChannelLimitLog ({index, row}) {
      if (this.mainTable.current) {
        this.$refs['dialog-channel-limit-log'].show(row.batchId);
      }
    }

  }

}
</script>
